import {Component} from "../framework/component";

export class HelloWorld extends Component {
    constructor() {
        super({
            name: 'HelloWorld',
            template: `<h1 @click="greet">Hello, {{name}}!</h1>`,
            data: () => ({ name: 'World' }),
            methods: {
                greet() {
                    console.log(`Hello, ${this.data.name}!`);
                    this.data.name = 'Vue';
                }
            },
            watch: {
                name(newVal: string, oldVal: string) {
                    console.log(`name changed from ${oldVal} to ${newVal}`);
                }
            }
        });
    }

    protected mounted() {
        console.log('HelloWorld component mounted!');
    }

    protected updated() {
        console.log('HelloWorld component updated!');
    }
}

